<template>
    <div>
        <div class="table_box">
            <tyTable :searchFlag="false"
                     :listApi="$api.listConfFile"
                     :afterList="afterList"
                     :deleteApi="$api.deleteUser"
                     :delete-flag="false"
                     :openDrawer="openDrawer" ref="tyTable">
                <template v-slot:search="{ param}">
<!--                    <el-form-item label="用户姓名:" prop="name">
                        <el-input placeholder="请输入用户姓名" v-model="param.name" maxlength="200" clearable/>
                    </el-form-item>-->
                </template>

                <!--            按钮-->
                <template v-slot:search-operation>
                    <el-form-item>
                        <el-button icon="el-icon-plus" type="primary"
                                   @click="readConf()">读取conf
                        </el-button>
                    </el-form-item>

                    <el-form-item>
                        <el-button icon="el-icon-plus" type="primary" v-loading="loading"
                                   @click="executeNginx($api.startNginx)">启动nginx
                        </el-button>
                    </el-form-item>
                    <el-form-item>
                        <el-button icon="el-icon-plus" type="primary"
                                   @click="writeConf()">写入conf
                        </el-button>
                    </el-form-item>
                    <el-form-item>
                        <el-button icon="el-icon-plus" type="primary" v-loading="loading"
                                   @click="executeNginx($api.checkNginx)">检查nginx
                        </el-button>
                    </el-form-item>

                    <el-form-item>
                        <el-button icon="el-icon-plus" type="primary" v-loading="loading"
                                   @click="executeNginx($api.reloadNginx)">重启nginx
                        </el-button>
                    </el-form-item>
                </template>

                <template v-slot:table>
                    <el-table-column type="index" label="序号" align="center" width="52"></el-table-column>
                    <el-table-column prop="name" label="文件" align="center"></el-table-column>
                    <el-table-column prop="path" label="路径" align="center"></el-table-column>
                    <el-table-column prop="sort" label="排序" align="center"></el-table-column>
                </template>
            </tyTable>
        </div>

        <tyAddUpdate :model="formData"
                     :add-api="$api.addUser"
                     :update-api="$api.updateConfFile"
                     :submitBefor="submitBefor"
                     :beforeHandler="beforeHandler"
                     :dialogSize="'60%'"
                     ref="tyAddUpdate"
        >
            <el-form label-position="left" label-width="100px" :model="formData" :rules="rules">
                <el-form-item label="文件:" prop="name">
                    <el-input v-model="formData.name" placeholder=""  clearable disabled
                              maxlength="300"></el-input>
                </el-form-item>
                <el-form-item label="路径:" prop="path">
                    <el-input v-model="formData.path" placeholder=""  clearable disabled
                              maxlength="300"></el-input>
                </el-form-item>
                <el-form-item label="排序:" prop="sort">
                    <el-input v-model="formData.sort" placeholder=""  clearable type="number"
                              maxlength="300"></el-input>
                </el-form-item>

                <el-form-item label="内容">
                    <el-input v-model="formData.content" type="textarea" autosize placeholder=""
                             ></el-input>
                </el-form-item>

            </el-form>
        </tyAddUpdate>

    </div>
</template>

<script >
import {tyAddUpdateMixins, tyConfirmMixins} from "@/mixins/addEditFormMixins";

export default {
    name: "confFile",
    mixins: [tyAddUpdateMixins, tyConfirmMixins],
    data(){
        return{
            formData : {},
            loading:false,
        }
    },
    methods : {
        readConf(){
            this.$api.readeConfFile().then(res=>{
                this.$refs.tyTable.getList()
                this.$message({
                    message: '读取成功',
                    type: 'success'
                });
            })
        },
        executeNginx(api){
            this.loading = true;
            api().then(res=>{
                this.$message(res);
                this.loading = false;
            })
        },
        writeConf(){
            this.$api.writeConfFile().then(res=>{
                this.$refs.tyTable.getList()
                this.$message({
                    message: '写入成功',
                    type: 'success'
                });
            })
        }
    },
    mounted() {
        var compoent = this.$refs.tyAddUpdate
        document.addEventListener("keydown", function(event) {
            if(event.keyCode === 13) {
                compoent.submit()
            }
        });
    }
}
</script>

<style scoped lang="scss">

</style>